import {TableConfig} from "../api-service/entity/table-config";
import {ColDef} from "ag-grid-community";
import {SysClass} from "../enums/sys-class";

export function getColDef(config: TableConfig): ColDef {
  const def = {
    field: config.colCode, // 取哪个属性值
    headerName: config.colName, // 表头名字
    width: TableConfig.getCellWidth(config), // 自定义单元格宽度
    type: config.colType
  } as ColDef

  // 定义如何获取sysClass显示值
  if (config.colCode === 'sysClass') {
    def.valueGetter = ({data}) => {
      return SysClass.getSysClass(data.sysClass)?.name
    }
  }
  return def;
}


export function getColDefCustomType(config: TableConfig): ColDef {
  const def = getColDef(config)
  /*
  filter  内置4种
   1. agNumberColumnFilter	A filter for number comparisons.
   2. agTextColumnFilter	A filter for string comparisons.
   3. agDateColumnFilter	A filter for date comparisons.
   4. agSetColumnFilter 企业版功能， 类似excel 的过滤器
   但这几种都不太好看，不太方便，可以自定义 https://www.ag-grid.com/angular-data-grid/component-filter/#custom-filter-parameters-1
  */
  def.filter = 'agTextColumnFilter'
  if (config.colCode === 'checkbox') {
    def.checkboxSelection = true
    def.headerCheckboxSelection = true
    def.headerCheckboxSelectionFilteredOnly = true
  }
  return def;
}

/**
 * 一些默认的列配置
 */
export function columnTypes(): { [typeName: string]: ColDef } {

  /*
   列属性配置的优先级
    1. 先将 defaultColDef 中的属性应用于每一列
    2. 将本组的属性  defaultColGroupDef 就用于本组的每一列
    3. 将 columnTypes 中定义的类型应用于匹配到的列上
    columnTypes 的作用是将相同的列定义统一管理，在每一列的定义中的 type 属性中表明自己是哪一种列
    例：
    const columnTypes = {
       custom1: { editable: false },
       custom2: {
          filter: 'agDateColumnFilter'
       }
    }
    const colDef = [
       { headerName: 'Col A', field: 'a'},
       { headerName: 'Col C', field: 'c', type: 'custom1' },
       { headerName: 'Col D', field: 'd', type: 'custom2' },
       { headerName: 'Col E', field: 'e', type: ['custom1', 'custom2'] }
    ]
    这时 第2列Col C 就会有 editable: false 这个配置
     第3列Col D 就会有 filter: 'agDateColumnFilter' 这个配置
     第4列Col E 就会有 editable: false 和 filter: 'agDateColumnFilter'
   */
  return {
    label: {
      editable: false
    },
    dateTime: {},
    select: {},
    search: {},
    input: {
      editable: true
    }
  }
}
